<template>
	<view class="box">
		<view class="choise" v-if="choosenumber==0">
			<view class="aa">请选择你的身份：</view>
			<view class="bb" @click="choosemode(1)"></view>
			<view class="cc" @click="choosemode(2)"></view>
		</view>
		<view class="oldbox" v-if="choosenumber==1">
			<view class="title">注册成为用户群体</view>
			<view class="hang"><text>用户名：</text><input type="text" v-model="userbo.username" placeholder="请输入:"></view>
			<view class="hang"><text>证件号码：</text><input type="text" @change="queryage()" v-model="userbo.idCard" placeholder="请输入正确证件号:"></view>
			<view class="hang"><text>年龄：</text><input type="number" disabled="true" v-model="userbo.age" placeholder="--"></view>
			<!-- <form-picker id="picker"
				name="社区"
				v-model="userbo.communityId"
				placeholder="请选择您的社区"
				rangeKey="communityName"
				rangeValue="communityId"
				:range="array"
			></form-picker> -->
			<view class="pickerBox">
				<view class="picker">
					请选择您所在的乡镇
				</view>
				<picker mode="multiSelector" @change="bindchange" @columnchange="columnchange" :range="timeList" range-key="communityName">
					<view class="picker-item">{{title}}</view>
				</picker>
			</view>
			<view class="hang"><text>现居住地：</text><input type="text" v-model="userbo.juzhudi" placeholder="请输入现住址:"></view>
			<view class="hang hangsex"><text>性别：</text>
				<view class="sex">
					<view class="sex1" @click="changesex(1)" :class="{seleced:userbo.sex==1}">
						男
					</view>
					<view class="sex1" @click="changesex(2)" :class="{seleced:userbo.sex==2}">
						女
					</view>
				</view>
			</view>
			<view class="buon" @click="usersubmit">
				提交
			</view>

		</view>
		<view class="orgbox" v-if="choosenumber==2">
			<view class="title">注册成为机构</view>
			<view class="hang hangsex"><text>注册类型：</text>
				<!-- <radio-group @change="orgChange" class="ras er">
					<label class="radio">
						<radio value="0" checked="true" />进入已有公司</label>
					<label class="radio">
						<radio value="1" />申请新服务商</label>
				</radio-group> -->
				<view class="">
					<view class="orgmode"  @click="changeorg(0)" :class="{orgmodeed:orgbo.instituteType==0}">
						进入已有公司
					</view>
					<view class="orgmode" @click="changeorg(1)" :class="{orgmodeed:orgbo.instituteType==1}">
						申请新服务商
					</view>
				</view>
			</view>

			<view class="hang chang"><text>营业执照：</text>
				<!-- <input type="text" v-model="orgbo.companyImg"> -->
				<image src="../../static/images/certification01.png" mode=""  class="uptu" @click="companyimgup" v-if="orgbo.companyImg==''||orgbo.companyImg==null"></image>
				<view v-if="orgbo.companyImg!==''" class="del" @click="delcom">
					删除
				</view>
				<image v-if="orgbo.companyImg!==''" :src="orgbo.companyImg"></image>
			</view>
			<view class="hang" v-if="orgbo.instituteType==0"><text>验证理由：</text><input type="text" v-model="orgbo.companyMessage" placeholder="请输入您的申请理由:"></view>
			<form-picker id="picker"
				name="公司"
				v-model="orgbo.id"
				placeholder="请选择您的公司"
				rangeKey="name"
				rangeValue="id"
				:range="org"
				v-if="orgbo.instituteType==0"
				class="pikerfont"
			></form-picker>
			<view class="hang" v-if="orgbo.instituteType==0"><text>用户名：</text><input type="text" v-model="orgbo.corpName" placeholder="请输入:"></view>
			<view class="hang" v-if="orgbo.instituteType==1"><text>法人：</text><input type="text" v-model="orgbo.corpName" placeholder="请输入:"></view>
			<view class="hang" v-if="orgbo.instituteType==1"><text>法人证件：</text><input type="text" v-model="orgbo.corpId" placeholder="请输入正确证件号:"></view>
			<view class="hang" v-if="orgbo.instituteType==1"><text>公司名称：</text><input type="text" v-model="orgbo.name" placeholder="请输入公司名称:"></view>
			<view class="hang chang" v-if="orgbo.instituteType==1"><text>法人证件正面：</text>
				<!-- <input type="text" v-model="orgbo.companyImg"> -->
				<image src="../../static/images/certification01.png" mode="" class="uptu"  @click="picCorpZup" v-if="orgbo.picCorpZheng==''||orgbo.picCorpZheng==null"></image>
				<view v-if="orgbo.picCorpZheng!==''" class="del" @click="delpictz">
					删除
				</view>
				<image v-if="orgbo.picCorpZheng!==''" :src="orgbo.picCorpZheng"></image>
			</view>
			<view class="hang chang" v-if="orgbo.instituteType==1"><text>法人证件反面：</text>
				<!-- <input type="text" v-model="orgbo.companyImg"></view> -->
				<image src="../../static/images/certification01.png" mode=""  class="uptu" @click="picCorpFup" v-if="orgbo.picCorpFan==''||orgbo.picCorpFan==null"></image>
				<view v-if="orgbo.picCorpFan!==''" class="del" @click="delpictf">
					删除
				</view>
				<image v-if="orgbo.picCorpFan!==''" :src="orgbo.picCorpFan"></image>
			</view>
			<view class="buon" @click="orgsubmit">
				提交
			</view>
		</view>

	</view>
</template>

<script>
	import {
		HTTP_SERVER_URL,
		STATUS_CODE
	} from '../../config/index.js';
	import * as commonApi from '@/api/common.js';
	import * as modelApi from '@/api/userApi/model.js';
	import * as userApi from '@/api/userApi/user.js';
	export default {
		data() {
			return {
				a:null,
				town:[],
					title:'请选择',
					comAll:[],
					timeList: [{},{}],
					childArr:[],//二级分类数据源
					timesIndex: [0,0],
					userInfo: this.$store.getters.getUserInfo,
					init: false,
					defaultButton: 'back',
					model: {},
					sexList: [
						{
							isActive: true,
							label: '男'
						},
						{
							isActive: false,
							label: '女'
						}
					],
					communityAllList: [],
					com:[],
				birthday: '',
				index: 0,
				xiansih: [],
				user: null,
				userbo: {
					age: null,
					communityId: 1,
					idCard: "",
					juzhudi: "",
					openId: "",
					phone: "",
					sex: 1,
					username: "",
					wxAvatar: "",
					wxNickname: ""
				},
				orgbo: {
					companyImg: "",
					companyMessage: "",
					corpId: "",
					corpName: "",
					id: 1,
					instituteType: 0,
					name: "",
					openId: "",
					phone: "",
					picCorpFan: "",
					picCorpZheng: "",
					wxAvatar: "",
					wxNickname: ""
				},
				choosenumber: 0,
				org:[],
				array:[]
			}
		},
		onLoad() {
			uni.request({
				url: HTTP_SERVER_URL + "/sys/community/getAll",
				method: "GET",
				success: (res) => {
					console.log(res.data.data)
					this.array = res.data.data
					//console.log(this.array)
					
				},
			});
			uni.request({
				url:HTTP_SERVER_URL+"/institute/company/queryInstitute",
				method:'POST',
				success: (res) => {
					console.log('机构',res)
					this.org=res.data.data
					
				}
			})
		},
		onShow() {
			
		},
		created() {
			this.getcom()
		},
		methods: {
			getCommunityAllList() {
				commonApi 
					.getCommunityAllList()
					.then(res => {
						if (res.code === 0) {
							this.timeList[0]=res.data.slice(0,5);
							console.log('乡镇',this.timeList[0])
							this.communityAllList = res.data.slice(0,5);
							
						}
					})
					.catch(e => {
						uni.showToast({
							title: e.msg,
							icon: 'none',
							duration: 1000
						});
					});
			},
			getcom(){
				uni.request({
						url:HTTP_SERVER_URL+'/sys/community/getCommunity',
						data:1,
						method:"GET",
						success:(res)=>{
							console.log('新',res)
							this.comAll=res.data.data;
							this.town=[];
							this.timeList[0]=this.comAll
							this.$set(this.timeList,1,this.comAll[0].list)
							
							
							
						}
					})
			},
			bindchange(e){
				console.log('picker发送选择改变，携带值为', e.target.value)
				let a=e.target.value
				let b=e.target.value[1]
				console.log('aaaaaaaa',b)
				
				this.title=''+this.timeList[0][a[0]].communityName+this.timeList[1][a[1]].communityName
				this.model.communityId=this.timeList[1][b].communityId
				console.log(this.model.communityId)
			},
			columnchange(e){
				console.log('右侧切换',e.detail)
				this.a=e.detail.value
				if(e.detail.column==0){
					this.$set(this.timeList,1,this.comAll[this.a].list)
					// this.timeList[1]=this.comAll[e.detail[this.a].list]
				}
			},
			changesex(e) {
				console.log(e)
				this.userbo.sex = e
				console.log(this.userbo.sex)
			},
			changeorg(a) {
				console.log(a)
				this.orgbo.instituteType = a
				console.log(this.orgbo.instituteType)
			},
			getAge() {
				let birthdays = new Date(this.brthday.replace(/-/g, '/'));
				let d = new Date();
				let age =
					d.getFullYear() -
					birthdays.getFullYear() -
					(d.getMonth() < birthdays.getMonth() || (d.getMonth() == birthdays.getMonth() && d.getDate() < birthdays.getDate()) ?
						1 : 0);
				return age;
			},
			queryage() {
				//得到年龄
				let reg = /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/;
				console.log('正则判断',reg.test(this.userbo.idCard))
				if(!reg.test(this.userbo.idCard)){
					uni.showToast({
						title:'身份证信息有误',
						icon:'none',
						position:'center'
					})
				}
					 
				if (this.userbo.idCard && this.userbo.idCard.length == 18) {
					this.brthday = this.userbo.idCard.substring(6, 10) + '-' + this.userbo.idCard.substring(10, 12) + '-' + this.userbo
						.idCard.substring(12, 14);
					let age = this.getAge();
					this.userbo.age = age
					this.$set(this.userbo, 'age', age);
				} else {
					this.userbo.age = '';
				}
			},
			delcom() {
				this.orgbo.companyImg = ""
			},
			delpictz() {
				this.orgbo.picCorpZheng = ""
			},
			delpictf() {
				this.orgbo.picCorpFan = ""
			},
			radioChange(evt) {
				//console.log(evt.target.value)
				this.userbo.sex = evt.target.value
				//console.log("--------",this.userbo.sex)
			},
			orgChange(evt) {
				console.log(evt.target.value)
				this.orgbo.instituteType = evt.target.value
			},
			companyimgup() {
				uni.chooseImage({
					count: 1,
					success: res => {
						console.log('选择图片',res)
						uni.uploadFile({
							url: HTTP_SERVER_URL + "/institute/service-image/addImage",
							filePath: res.tempFilePaths[0],
							name: "file",
							formData: {
								'user': 'test'
							},
							success: (uploadFileRes) => {
								var obj = JSON.parse(uploadFileRes.data)
								//console.log(obj)
								this.orgbo.companyImg = obj.data

							},
							fail: (err) => {
								console.log(err)
							}
						})
					}
				})
			},
			picCorpZup() {
				uni.chooseImage({
					count: 1,
					success: res => {
						console.log('选择图片2',res)
						uni.uploadFile({
							url: HTTP_SERVER_URL + "/institute/service-image/addImage",
							filePath: res.tempFilePaths[0],
							name: "file",
							formData: {
								'user': 'test'
							},
							success: (uploadFileRes) => {
								var obj = JSON.parse(uploadFileRes.data)
								//console.log(obj)
								this.orgbo.picCorpZheng = obj.data
							},
							fail: (err) => {
								console.log(err)
							}
						})
					}
				})
			},
			picCorpFup() {
				uni.chooseImage({
					count: 1,
					success: res => {
						uni.uploadFile({
							url: HTTP_SERVER_URL + "/institute/service-image/addImage",
							filePath: res.tempFilePaths[0],
							name: "file",
							formData: {
								'user': 'test'
							},
							success: (uploadFileRes) => {
								var obj = JSON.parse(uploadFileRes.data)
								//console.log(obj)
								this.orgbo.picCorpFan = obj.data
							},
							fail: (err) => {
								console.log(err)
							}
						})
					}
				})
			},
			choosemode(a) {
				this.choosenumber = a
			},
			usersubmit() {
				if((!this.userbo.username)||(!this.userbo.idCard)||(!this.userbo.age)){
					uni.showToast({
						title:"请完善信息后再提交",
						icon:'none',
						duration:2000
					})
					return
				}
				let phone = uni.getStorageSync('phone')
				let user = uni.getStorageSync('open')
				console.log(user)
				this.userbo.phone = phone
				console.log(this.userbo.phone)
				this.userbo.openId = user.openId,
					this.userbo.wxNickname = user.wxNickname,
					this.userbo.wxAvatar = user.wxAvatar,
					console.log(this.userbo)
				uni.request({
					url: HTTP_SERVER_URL + "/aged/user/agedRegister",
					method: "POST",
					data: this.userbo,
					success: (res) => {
						console.log(res)
						if (res.data.msg == "处理成功") {
							uni.showToast({
									title: "注册成功",
									position: "center"
								}),

								this.$store.dispatch('wechatLogin', user).then(res => {
									setTimeout(() => {
										uni.switchTab({
											url: '/pages/index/index'
										});
									}, 1100);
								})

						} else {
							uni.showToast({
								title: res.data.msg,
								position: "center"

							})
						}
					}
				})
			},
			orgsubmit() {
				console.log('1',this.orgbo.name)
				console.log('1',this.orgbo.corpId)
				console.log('1',this.orgbo.corpName)
				console.log('2',this.orgbo.id)
				console.log('2',this.orgbo.companyMessage)
				//判断新机构注册信息不能为空 判断就机构注册信息不能为空
				if(this.orgbo.instituteType==1){
				if((!this.orgbo.name)||(!this.orgbo.corpId)||(!this.orgbo.corpName)){
					uni.showToast({
						title:"请完善信息后再提交",
						icon:'none',
						duration:2000
					})
					return
				}
				}
				else{
					if((!this.orgbo.companyMessage)||(!this.orgbo.id)||(!this.orgbo.corpName)){
						uni.showToast({
							title:"请完善已有信息后再提交",
							icon:'none',
							duration:2000
						})
						return
					}
				}
				
				
				let phone = uni.getStorageSync('phone')
				let user = uni.getStorageSync('open')
				this.orgbo.phone = phone
				this.orgbo.openId = user.openId,
					this.orgbo.wxNickname = user.wxNickname,
					this.orgbo.wxAvatar = user.wxAvatar,
					uni.request({
						url: HTTP_SERVER_URL + "/institute/user/instituteRegister",
						method: "POST",
						data: this.orgbo,
						success: (res) => {
							console.log(res)
							if (res.data.msg == "处理成功") {
								uni.showToast({
										title: "注册成功,请等待审核",
										position: "center"
									}),

									this.$store.dispatch('wechatLogin', user).then(res => {
										setTimeout(() => {
											uni.switchTab({
												url: '/pages/index/index'
											});
										}, 1100);
									})

							} else {
								uni.showToast({
									title: res.data.msg,
									position: "center"

								})
							}
						}
					})

			}
		}
	}
</script>
<style lang="stylus">
	.pickerBox
		margin 20rpx auto 20rpx
		width 100%
		display flex
		justify-content space-between
		line-height 70rpx
		.picker
			font-size 28rpx
			color #333
			font-family PingFang SC;
			font-weight 400;
		.picker-item
			font-size 24rpx
			color #999
</style>

<style scoped>
	.box{
		padding: 120rpx 30rpx;
		box-sizing: border-box;
	}
	.hangsex {
		display: flex;
		justify-content: space-between;
	}

	.sex1 {
		display: inline-block;
		margin-left: 50rpx;
		text-align: center;
		font-family: PingFang SC;
		font-size: 28rpx;
		font-weight: 400;
		border-radius: 10rpx;
		color: #000000;
		line-height: 50rpx;
		width: 100rpx;
		height: 50rpx;
		background-color: #F0F0F0;
	}

	.seleced {
		background-color: rgba(251, 123, 34, 1);
		color: #FFFFFF;
	}
	.orgmode{
		display: inline-block;
		margin-left: 50rpx;
		text-align: center;
		font-family: PingFang SC;
		font-size: 28rpx;
		font-weight: 400;
		border-radius: 10rpx;
		color: #000000;
		line-height: 50rpx;
		width: 200rpx;
		height: 50rpx;
		background-color: #F0F0F0;
	}
	.orgmodeed {
		background-color: rgba(251, 123, 34, 1);
		color: #FFFFFF;
	}
	.box {
		width: 100%;
	}

	.pickerh {
		display: flex;
		justify-content: space-between;
	}

	.aa {
		margin: 90rpx 0 250rpx 30rpx;
		font-family: PingFang SC;
		font-size: 48rpx;
		font-weight: 400;
	}

	.bb{
		width:100%;
		margin:50rpx auto;
		height:240rpx;
		border-radius:50rpx;
		box-shadow:0px 10px 13px 2px rgba(254, 127, 39, 0.25);
		background: url(https://images-vx.oss-cn-beijing.aliyuncs.com/images-vx/uesr.png);
		background-size:100% 100%;		
	}
	.cc {
		width:100%;
		margin:50rpx auto;
		height:240rpx;
		border-radius:50rpx;
		box-shadow:0px 10px 13px 2px rgba(254, 127, 39, 0.25);
		background: url(https://images-vx.oss-cn-beijing.aliyuncs.com/images-vx/org.png);
		background-size:100% 100%;
	}

	.hang {
		line-height: 100rpx;
		min-height: 100rpx;
		width: 100%;
		margin: 10 auto 10rpx;
		display: flex;		
	}

	.hang>text {
		line-height: 100rpx;
		min-height: 100rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: #333;
		white-space: nowrap;
		width: 25%;
	}

	.chang>text {
		width: 50%;
	}

	.hang>input {
		height: 100rpx;
		line-height: 100rpx;
		width: 75%;
		font-family:"宋体";
		font-size: 24rpx;
		font-weight: 200;
		text-align: right;
		color: #888888;
	}
	.ras {
		width: 75%;
		display: flex;
		justify-content: space-around;
	}

	.chang {
		display: flex;
		flex-direction: column;
		min-height: 360rpx;
		height: 100%;
		position: relative;
	}

	.chang>image {
		margin: 20rpx auto;
		width: 100%;
		height: 360rpx;
		border-radius: 10rpx;
	}

	.uptu {
		margin: 20rpx auto;
		width: 100%;
		background: url(../../static/images/certification01.png));
		height: 360rpx;
		text-align: center;
		box-sizing: border-box;
		border-radius: 10rpx;
	}

	.buon {
		height: 90rpx;
		width: 90%;
		background: #FF7D21;
		color: #FFFFFF;
		border-radius: 40rpx;
		margin: 180rpx auto 50rpx;
		font-size: 32rpx;
		font-family: PingFang SC;
		text-align: center;
		line-height: 90rpx;
	}

	.title {
		width: 92%;
		margin: 50rpx auto 80rpx;
		font-size: 48rpx;
		font-family: PingFang SC;
		text-align: center;
	}

	.del {
		width: 100rpx;
		height: 50rpx;
		line-height: 50rpx;
		position: absolute;
		right: 0rpx;
		top: 60rpx;
		text-align: center;
		z-index: 2;
		border-radius: 5rpx;
		color: #FFFFFF;
		background: rgb(0, 0, 0, 0.2);
	}
</style>
